<template>
  <div id="app">
    <el-container>
      <el-header>
        <el-button
          type="primary"
          icon="el-icon-tickets"
          circle
        ></el-button>
        <div style="display: inline-block; padding: 10px;font: 20px Microsoft-yahei;">二三维一体化应用展现</div>
      </el-header>
      <el-row style="height:calc(100% - 80px)">
        <div id="mapContainer"></div>
      </el-row>
    </el-container>
  </div>
</template>

<script>
import * as jsc_3dmap from '../dist/jsc_3dmap.min.js'

var jscMap, map;

export default {
  data() {
    return {
    }
  },
  watch: {

  },
  mounted: function () {
    jscMap = new jsc_3dmap.JscMap('mapContainer', {
      center: [121.30306, 31.188906],
      satelliteUrl: 'http://192.168.9.19:8080/TileMapService/arcgis/rest/services/shanghaisatellite/MapServer/tile/{z}/{y}/{x}',
      satelliteLabelUrl: 'http://192.168.9.19:8080/TileMapService/arcgis/rest/services/shanghailabel/MapServer/tile/{z}/{y}/{x}',
      streetUrl: 'http://192.168.9.19:8080/TileMapService/arcgis/rest/services/Netmap/MapServer/tile/{z}/{y}/{x}',
      vectorUrl: 'http://192.103.108.26:8080/mapbox/json/bright-v9-cdn.json',
      defaultMap: 'vector',
      zoom: 12,
      minZoom: 4,
      maxZoom: 18
    });
    map = jscMap.map;
  },
  methods: {
    test() {
      console.info("");
    }
  }
}
</script>
